
$(function () {
    //1-页面加载后，在页面渲染第一屏用户数据

    var currentPage =1;
    var pageSize = 5;
    render();
    //渲染数据的封装为方法
    function render(){
        $.ajax({
            url: '/user/queryUser',
            type: 'get',
            data: {
                page: currentPage,
                pageSize: pageSize
            },
            dataType: 'json',
            success: function (info) {
                console.log(info);   
                //template 接受是数据必须是对象， 在模版中使用时对象的属性名
                $('tbody').html( template('tmp', info) );
                // --分页: 根据后台数据的总数   推算出每页的页数
                $("#paginator").bootstrapPaginator({
                    bootstrapMajorVersion:3,//指定bootstrap的版本，如果是3，必须指定
                    currentPage:info.page,//指定当前页
                    totalPages:Math.ceil(info.total/info.size),//指定总页数
                    // size:large,可以控制大小
                    //当分页标签被点击的事件
                    // 有写参数不想用 可以用_代替
                    onPageClicked:function(_,_,_,page){
                        //page 当前页码
                        //记录当前页页码
                        currentPage = page;
                        //调用渲染页面ajax的函数
                        render();
                    }
                });
            }
        })
    }

    //点击按钮 使用事件委托 绑定事件
    var id = 0;
    var isDelete =0;
    $('tbody').on('click','.btn-user',function(){
        //显示模态框
        $('#userModal').modal('show');
        //获取模板引擎上获取的id
       id = $(this).parent().data('id');//jquery中提供了data()方法 用于获取datda-开头的自定义属性
        //记录用户要禁用还是要启用
        //通过颜色判断
        isDelete= $(this).hasClass('btn-success')?1:0;

    })

    //点击模态框的确定按钮 操作对应的id数据
    $('.btn-ok').click(function(){
        //发送ajax请求
        $.ajax({
            url:'/user/updateUser',
            type:'post',
            data:{
                id:id,
                isDelete:isDelete
            },
            dataType:'json',
            success:function(info){
                //如果响应成功
                if(info.success){
                    //隐藏模态框
                    $('#userModal').modal('hide');
                    //重新渲染页面
                    render();
                }
            }
        })
    })

})